<template>
	<view>
		<view>
			<text>磨牙睡眠APP</text>
		</view>
		<view>
			<text user-select>磨牙睡眠APP</text>
		</view>
		<view>
			<text user-select space="emsp">磨牙 睡眠APP</text>
		</view>
		<view>
			<text user-select space="emsp" style="font-size:10rpx;">磨牙 睡眠APP</text>
		</view>
		<view>
			<text>&amp;</text>
		</view>
		<view class='box2'>
			<view class="box":hover-start-time="2000":hover-stay-time="2000" hover-class="box-active" hover-stop-propagation>开始</view>
		</view>
		<button>按钮</button>
		<button size="mini">按钮</button>
		
		<button type="primary" @click="clickhandle(20,$event)">按钮</button>
		
		<button loading>按钮</button>
		<view v-for="item in list">
				{{item}}
		</view>
	
		<button @click="pulldown">下拉刷新</button>
		<image src="https://destiny001.gitee.io/image/cxk.gif" mode="aspectFit" ></image>
		<view>
			<button type="primary"  @click="chooseImg">上传图片</button>
			<image v-for="item in imgarr":src="item" @click="previewimg"></image>
		</view>

	</view>
</template>

<script>
	export default{
		data(){
			return{
				list:['11','22','33','44'],
				imgarr:[]
			}
		},
		
		methods:{
			clickhandle(num,e){
				console.log('点击我了',num,e)
			}
		},
		onPullDownRefresh(){
			console.log('出发了下拉刷新')
			setTimeout(()=>{
				this.list=['77','88','99']
				uni.stopPullDownRefresh()
			},1000
			)
		},
		
		methods:{
			pulldown(){
				uni.startPullDownRefresh(
				)
			}
		},
		
		methods:{
			chooseImg(){
				uni.chooseImage({
					count:5,
					success:res=>{
						this.imgarr=res.tempFilePaths
					}
				})
			},
			previewimg(current){
				uni.previewImage({
					current,
					urls:this.imgarr,
					loop:true
				})
			}
		}
	}
</script>

<style>
	.box{
		width: 100px;
		height: 100px;
		background: green;
	}
	.box-active{
		background: #4CD964;
	}
	.box2{
		width: 200px;
		height:200px;
		background: #333333;
	}
</style>
